require('../css/commCss/normalize.css')
require('../css/commCss/reset.css')
require('../css/commCss/property.css')
require('../css/commCss/basic.css')
require('../libs/iconfont/iconfont.css')
require('../css/personalData.less')
require('weui')
const weui = require('weui.js')

const axios = require('axios')

document.addEventListener('DOMContentLoaded', function () {
    let back = document.querySelector('.back')
    let imgurl = document.querySelector('#imgurl')
    let nickname = document.querySelector('#nickName')
    let editUserName = document.querySelector('#editUserName')

    //数据渲染
    axios.get("http://139.9.177.51:8099/users/accountinfo", {
        params: {
            userId: localStorage.getItem('userId')
        }
    }).then(function (res) {
        console.log(res);
        imgurl.src = res.data.data.imgurl
        nickname.value = res.data.data.nickname
        sexShow.textContent = res.data.data.gender || '请选择'
        if(res.data.data.birthday) birthShow.textContent = res.data.data.birthday.substr(0, 10) || '';
        if(res.data.data.address){
            let end = res.data.data.address.indexOf(",")
            proShow.textContent = res.data.data.address.substr(0,end)
            cityShow.textContent = res.data.data.address.substr(end+1)
        }else{
            proShow.textContent = '请选择'
            cityShow.textContent = '请选择'
        }
        textarea.value = res.data.data.sign || ''
        if(res.data.data.sign) nowTextNum.textContent = res.data.data.sign.length || '0'
    })

    back.addEventListener('click', function () {
        history.go(-1)
    })
    //通过点击图片触发input
    imgurl.addEventListener('click', function () {
        upLoadImg.click()
    })
    //上传头像，通过判断上传的图片信息触发相应事件
    upLoadImg.addEventListener('change', function () {
        // console.log(this.files[0]);
        let file = this.files[0]
        let fd = new FormData()
        fd.append("imgurl", file)
        axios.post("http://139.9.177.51:8099/users/upload", fd).then(function (res) {
            console.log(res);
            if (res.data.status != 0) {
                weui.alert(res.data.msg)
            } else {
                imgurl.src = 'http://139.9.177.51:8099' + res.data.data
            }
        })
    })

    // 性别
    let sex
    showPicker.addEventListener('click', function () {
        weui.picker([{
            label: '男',
            value: 0
        }, {
            label: '女',
            value: 1
        }], {
            onConfirm: function (result) {
                sex = result[0].label
                // console.log(sex);
                sexShow.textContent = sex
            },
            title: '单列选择器'
        });
    });
    //补零函数
    function fillZero(n) {
        return n >= 10 ? n : '0' + n
    }
    // 生日
    let birthday = []
    document.querySelector('#showDatePicker').addEventListener('click', function () {
        weui.datePicker({
            start: 1990,
            end: new Date().getFullYear(),
            onConfirm: function (result) {
                console.log(result);
                result.forEach(function (v) {
                    birthday.push(fillZero(v.value))
                })
                birthShow.textContent = birthday.join('-')
                birthday = []
            },
            title: '多列选择器'
        });
    });

    // 所在城市
    let proArr = []
    let cityArr = []
    //获取省
    axios.get('http://139.9.177.51:8099/address/province').then(function (res) {
        // console.log(res);
        let pro = res.data.data
        // console.log(pro);
        proArr = pro.map(function (item) {
            return { label: item.name, value: item.addressId }
        })
    })
    console.log(proArr);
    //选择省份
    showProPicker.addEventListener('click', function () {
        weui.picker(proArr, {
            onConfirm: function (result) {
                console.log(result);
                proShow.textContent = result[0].label
                //获取城市
                axios.get(`http://139.9.177.51:8099/address/city/${result[0].value}`).then(function (res) {
                    console.log(res);
                    let city = res.data.data
                    cityArr = city.map(function (it) {
                        return { label: it.name, value: it.addressId }
                    })
                    cityShow.textContent = res.data.data[0].name
                })
            },
            title: '单列选择器'
        });
    });
    //选择城市
    showCityPicker.addEventListener('click', function () {
        weui.picker(cityArr, {
            onConfirm: function (result) {
                console.log(result);
                cityShow.textContent = result[0].label
                console.log(proCity);
            },
            title: '单列选择器'
        });
    });

    // 动态渲染
    textarea.addEventListener('input', function (e) {
        nowTextNum.textContent = this.value.length
    })

    //修改信息-点击保存信息把信息上传到后台
    saveBtn.addEventListener('click', function () {
        let params = {
            imgurl: imgurl.src,
            nickname: nickname.value,
            gender: sexShow.textContent,
            birthday: birthShow.textContent,
            address: [proShow.textContent,cityShow.textContent],
            sign: textarea.value,
            userId: localStorage.getItem("userId")
        }
        console.log(params);
        axios.post("http://139.9.177.51:8099/users/userEdit",params).then(function (res) {
            console.log(res);
            if (res.data.status === 0) {
                weui.toast('修改成功', {
                    callback: function () {
                        location.href = './mine.html'
                    }
                })
            }else{
                weui.alert('修改失败')
            }

        })
    })


})